<template>
  <div class="app-container">
    <my-header title="购物车案例"></my-header>
    <my-goods v-for="item in list" :key="item.id" :item="item"></my-goods>
    <my-footer :list="list"></my-footer>
  </div>
</template>

<script>
import MyHeader from "./components/MyHeader.vue";
import MyFooter from "./components/MyFooter.vue";
import MyGoods from "./components/MyGoods.vue";
export default {
  components: {
    MyHeader,
    MyFooter,
    MyGoods,
  },
  data() {
    return {
      list: [],
    };
  },

  async created() {
    let { data: res } = await this.$axios({
      url: "/api/cart",
    });
    this.list = res.list;
  },

  methods: {},
};
</script>

<style lang="less" scoped>
.app-container {
  padding: 45px 0 50px 0;
}
</style>